<template>
	<view>
		<view class="top-box-search">
			<u-navbar :is-back="false" :background="background" :border-bottom="false">
				<view class="df  ml30" style="align-items:baseline">
					<view class="fs36 app-theme fw5">
						购物车<text class="fs24 fw4">({{numAll||0}})</text>
					</view>
					<view class="localtion df aic app-theme fs22 ml30" @click="handleLocation" v-if="TOKEN">
						<nmr-icon name="dingwei-3" size="22" color="#48A147"></nmr-icon>
						<view style="max-width: 280rpx;" class="u-line-1"> {{LOCATION.name||'请选择地址'}}</view>
						<nmr-icon name="xiangyou1" size="22" color="#48A147"></nmr-icon>
					</view>
					<view class="localtion df aic app-theme fs22 ml30" @click="handleLocation" v-else>
						<nmr-icon name="dingwei-3" size="22" color="#48A147"></nmr-icon>
						未登录
						<nmr-icon name="xiangyou1" size="22" color="#48A147"></nmr-icon>
					</view>
				</view>
			</u-navbar>
		</view>
		<!-- 主内容 -->
		<!-- 操作区域 -->
		<view class="handle-top df aic jcsb">
			<view class="df aic fs24 c6" @click="getDoc">
				下单须知，下单前请查看<nmr-icon name="xiangyou1" size="22" color="#666666"></nmr-icon>
			</view>
			<view class=" df aic" v-if="TOKEN&&goodsList.length">
				<view class="edit-text mr20" v-if="isEdit" @click="isEdit = false">完成</view>
				<view class="edit-text mr20" v-else @click="changeEdit">编辑</view>
				<view class="clear-text" @click="showClear = true">清空</view>
			</view>
		</view>
		<scroll-view :style="{'height':warpperHeight+'px'}" scroll-y="true">

			<view class="" style="overflow: hidden;" v-if="TOKEN">
				<view class="content" v-if="goodsList.length">
					<uni-swipe-action>
						<view class="shop-container mb20" v-for="(shop,shopIndex) in goodsList">
							<view class="df aic  cdxx-box fs24 c3 fwb" v-if="shop.list.length&&shop.list[0].isSelfSend==1&&checkFeeInfo(shop.supplierId).sendLimit">
								<view class="cdxx mr10">凑单提示</view>
								满{{checkFeeInfo(shop.supplierId).sendLimit}}元配送,还差{{checkFeeInfo(shop.supplierId).diff}}元<u-icon name="question-circle" color="#48A147" class="ml5" @click="feeInfoShow = true"></u-icon>
								<view class="cdxx-right price" @click="handleSearch(shop)">
									去凑单 <nmr-icon name="xiangyou1" size="22" color="#666666"></nmr-icon>
								</view>
							</view>
							
							<view class="df aic ml20">
								<u-checkbox :key="shop.supplierId" @change="checkboxChangeShop(shop,shopIndex)"
									active-color="#48A147" style="width: 50rpx;" shape="circle"
									v-model="shop.checkFlag"></u-checkbox>
								<view class="fwb fs28 c3 df aic" @click="handleSearch(shop)"><text>{{shop.supplierName}}</text> <nmr-icon name="xiangyou1" size="22"
										color="#666666"></nmr-icon></view>
										<view :class="shop.list[0].isSelfSend==1?'price':'app-theme'" class="sendClass">
											{{shop.list[0].isSelfSend==1?'商家配送':'平台配送'}}
										</view>
							</view>
							<uni-swipe-action-item :key="item.platformGoodsSpecMixId" :auto-close="false"
								:show="isOpened" @click="bindClick" v-for="(item,index) in shop.list">
								<view class="item df jcsb aic  "  :class="{'borderBottomNone':index==shop.list.length-1}">
									<view class="df aic">
										<u-checkbox :key="item.platformGoodsSpecMixId"
											@change="checkboxChange(item,shop)" active-color="#48A147"
											style="width: 50rpx;" shape="circle" v-model="item.checkFlag"></u-checkbox>
										<u-image :src="item.image" width="158" height="158" borderRadius="10"></u-image>
									</view>
									<view class="" style="width: 420rpx;">
										<view class="c3 fs28 u-line-2">
											{{item.customGoodsName}}
										</view>
										<view class="goodsLabel mt5">
											{{item.specName}}
										</view>
										<view class="c9 fs22">{{item.introduce||''}}</view>

										<view class="df aic jcsb c3 fs24 mt10 mb10">
											<view class="price">
												<text class="fw4 price fs22">¥</text><text
													class="fw5 price fs30">{{item.platformPrice||0}}</text>
											</view>
											<view class="">
												<zm-number-box :saleUnit="item.saleUnit"
													:startSaleNum="item.startSaleNum"
													:step="item.startSaleNum&&item.isDouble==1?item.startSaleNum:1"
													:disabledInput="item.isDouble==1" :id="item.platformGoodsSpecMixId"
													:key="item.platformGoodsSpecMixId" size="40"
													@change="valChange(item,shopIndex,index)" :min="0"
													v-model="item.purNum"></zm-number-box>
											</view>
										</view>
									</view>
								</view>
								<template v-slot:right>
									<view class="df ">

										<view class="handle_delect fs24 df aic jcc" @click="handleOneDelect(index,shopIndex)">
											<nmr-icon name="shanchu-6" color="white"></nmr-icon>
											<view class="">删除</view>
										</view>
									</view>
								</template>
							</uni-swipe-action-item>
						</view>

					</uni-swipe-action>
				</view>
				<view class="empty" v-else>
					<view class="u-text-center">
						<image src="../../static/empty/content-empty.png" style="width: 428rpx;height: 161rpx;"
							mode="widthFix">
						</image>
						<view class="fs28 c6 mt20">
							购物车空空如也哦~
						</view>
						<view @click="goHome" class="go-home df aic jcc mt30">
							去首页逛逛
						</view>
					</view>
				</view>
			</view>
			<view class="empty" v-else>
				<view class="u-text-center">
					<image src="../../static/empty/content-empty.png" style="width: 428rpx;height: 161rpx;"
						mode="widthFix">
					</image>
					<view class="fs28 c6 mt20">
						登录后可同步购物车列表
					</view>
					<view @click="showLogin" class="go-home df aic jcc mt30">
						登录
					</view>
				</view>
			</view>
		</scroll-view>
		<SubmitBtn @feeInfo="feeInfoShow = true" :platformFeeInfo="checkFeeInfo('')" @handleViewPrice="showPrice = true" :sendPirce="infoByAreaIdFee.sendMoney"
			@handlesubmit="handlesubmit" @handleDele="handleDele" :checked="checkedAll" :priceAll="priceAll"
			:checkNum="checkNum" v-if="TOKEN&&goodsList.length" :isEdit="isEdit" ref="SubmitBtn" @selectAll="selectAll">
		</SubmitBtn>
		<ModalMsg @confirm="confirmClear" desc="确定清空购物车？" v-model="showClear"></ModalMsg>
		<ModalMsg desc="确定删除商品？" @confirm="confirmCheckDelect" v-model="showDelete"></ModalMsg>
		<ModalMsg desc="确定删除商品？" @confirm="confirmCheckOneDelect" v-model="showDeleteOne"></ModalMsg>
		<ModalMsg  v-model="showPay" :showCancel="false">
			<view class="p030 fs26">
				未达到<text class="fwb c3 m010">{{NoFeeInfo.bSendRange.supplierName||'宅美批发商城平台'}}</text>最低配送金额<text class="price fwb">{{NoFeeInfo.sendLimit||0}}</text>元
			</view>
		</ModalMsg>
		<ModalMsg v-model="showAddress" confirmName="请选择收货地址" @confirm="chooseAddress" :showCancel="false">
			<view class="address-desc mt30 fs26 c3 u-text-center">
				以下地址为附近定位，请选择您的收货地址
				<view class="localtion df aic jcc app-theme fs22 mt30 u-text-center">
					<nmr-icon name="dingwei-3" size="22" color="#48A147"></nmr-icon>
					{{LOCATION.name||''}}
				</view>
			</view>
		</ModalMsg>
		<ModalMsg v-model="showLocaltion" confirmName="前往定位" @confirm="handleLocation" :showCancel="false">
			<view class="address-desc mt30 fs26 c3 u-text-center">
				您当前暂未定位，请定位后使用服务
			</view>
		</ModalMsg>
		<ModalMsg width="680" v-model="feeInfoShow" title="配送费说明" :showCancel="false">
			<view class=" mt30 fs26 c3 p020 u-text-left" style="line-height: 60rpx;">
				<view class="">
					1、采购满平台设置的起送费后方可下单。
				</view>
				<view class="">
					2、配送费=基础配送费+超重配送费，例如：货物重量在<text class="app-theme">20kg</text>以内仅收取基础配送费<text class="price">8</text>元，超出部分，加收<text class="price">0.3</text>元/kg(不足<text class="app-theme">1</text>按<text class="app-theme">1</text>kg收取)。
				</view>
				<view class="">
					3、不同城市或者不同地址的基础配送费和加收费用可能不同，请以小程序的实际显示为准。
				</view>
			</view>
		</ModalMsg>
		<!-- 价格明细 -->
		<PricePopup @FeePrice="showFeePrice = true" :platformFeeInfo="checkFeeInfo('')" @feeInfo="feeInfoShow = true" v-model="showPrice" :sendPirce="infoByAreaIdFee.sendMoney" :priceAll="priceAll"></PricePopup>
		<LoginPopup @loginSuccess="loginSuccess" ref="LoginPopup"></LoginPopup>
		<FeePricePopup @feeInfo="feeInfoShow = true" :goodsList="orderChildList" v-model="showFeePrice" :infoByAreaIdFee="infoByAreaIdFee" :platformFeeInfo="checkFeeInfo('')"></FeePricePopup>
		
	</view>
</template>

<script>
	import Decimal from "decimal.js";
	import SubmitBtn from './components/SubmitBtn.vue'
	import ModalMsg from '@/components/ModalMsg.vue'
	import PricePopup from './components/PricePopup.vue'
	import FeePricePopup from './components/FeePricePopup.vue'
	
	import {
	getSendMoney
	} from "@/api/order.js"
	import {
		updatePrice
	} from "@/api/goods.js"

	export default {
		components: {
			SubmitBtn,
			ModalMsg,
			PricePopup,
			FeePricePopup
		},
		data() {
			return {
				showFeePrice:false,
				feeInfoShow:false,
				showPrice: false,
				showAddress: false,
				isEdit: false, //是否编辑状态
				showClear: false,
				showDelete: false,
				showDeleteOne: false,
				showPay: false,
				purNum: 0,
				warpperHeight: 1000,
				initWarpperHeight:1000,
				goodsList: [],
				numAll: 0,
				priceAll: 0,
				checkNum: 0,
				checkedAll: false,
				infoByAreaIdFee: {
					sendMoney: 0,
					childList:[]
				},
				delectIndex: 0,
				delectShopIndex: 0,
				arrFalg:[],
				showLocaltion:false,
				areaGoodsListParams:[],//运费参数
				NoFeeInfo:{bSendRange:{}},
				orderChildList:[]
			}
		},
		watch: {
			goodsList: {
				handler(e,o) {
					
					this.numAll = new Decimal(0)
					this.priceAll = 0
					this.checkNum = 0
					this.arrFalg = []
					e.forEach((i,index)=> {
						let goodsList = i.list
						if(!goodsList.length){
							e.splice(index,1)
						}
						let flag = goodsList.some(e =>e.checkFlag)
						if(flag)this.arrFalg.push({
							id:i.supplierId
						})
						goodsList.forEach(item =>{
							this.numAll = new Decimal(this.numAll).add(new Decimal(item.purNum)) 
							if (item.checkFlag) {
								this.checkNum = new Decimal(this.checkNum).add(new Decimal(item.purNum))
								let platformPrice = new Decimal(item.platformPrice || 0)
								let price = platformPrice.mul(item.purNum)
								this.priceAll = new Decimal(this.priceAll).add(price).toFixed(2)
							}
						})
					
					})
					this.infoByAreaId()
					// 全选按钮
					this.checkedAll = !e.some(item => !item.checkFlag)
					if(o&&o.length)this.revertGoods()
					
				},
				immediate: true,
				deep: true
			}
		},
		// onLoad() {
		// 	this.goodsList = JSON.parse(JSON.stringify(this.CARGOODLIST))
		// 	console.log('onLoad',this.goodsList)
		// },
		onShow() {
			this.updatePrice()
			// this.infoByAreaId()
		},
		mounted() {
			let that = this
			uni.getSystemInfo({
				success: function(res) {
					// #ifdef MP-WEIXIN
					that.warpperHeight = res.windowHeight - res.statusBarHeight - uni.upx2px(76 + 120) - (
						res.platform == 'ios' ? 44 : 48)
					that.initWarpperHeight = that.warpperHeight
					// #endif

				}
			});
		},
		methods: {

			filterArrayBysupplierId(arr) {
				const filteredArray = [];
				const groupedData = {};
				for (const item of arr) {
					const supplierId = item.supplierId||'';
					const supplierName = item.supplierName||'宅美自营';
					if (!groupedData[supplierId]) {
						groupedData[supplierId] = {
							list:[],
							supplierName:supplierName,
							supplierId:supplierId,
						};
						this.$set(groupedData[supplierId],'checkFlag',false)
					}
					item.saleNum = item.purNum
					this.$set(item,'checkFlag',item.checkFlag)
					groupedData[supplierId].list.push(item);
				}
				for (const key in groupedData) {
					groupedData[key].checkFlag = !groupedData[key].list.some(item => !item.checkFlag)
					filteredArray.push(groupedData[key]);
				}
				return this.sortArray(filteredArray);
			},
			sortArray(arr){
				 let sortedArr = [];
				 let id2Arr = [];
				 let idNot2Arr = [];
				 for (let obj of arr) {
					 let isSelfSend = obj.list[0].isSelfSend
					 let supplierId = obj.supplierId
				   if (isSelfSend ==0 && supplierId== '') {
				     sortedArr.push(obj);
				   } else if (isSelfSend ==0 && supplierId !== '') {
				     idNot2Arr.push(obj);
				   } else {
				     id2Arr.push(obj); 
				   }
				 }
				 sortedArr = sortedArr.concat(idNot2Arr, id2Arr); // 拼接三个数组
				return sortedArr
			},
			revertGoods(){
				let list = []
				this.goodsList.forEach(shop =>{
					shop.list.forEach(item =>{
						list.push(item)
					})
				})
				uni.setStorageSync('CARGOODLIST', list)
				let num = this.$common.clacCount(list)
				if (num == 0) {
					uni.removeTabBarBadge({
						index: 3
					})
				} else {
					uni.setTabBarBadge({
						index: 3,
						text: num
					})
				}
				return list
			},
			loginSuccess() {
				this.updatePrice()
			},
			/* 更新价格 */
			updatePrice() {
				let goodsList = uni.getStorageSync('CARGOODLIST') || []
				if(!goodsList.length){
					this.goodsList = []
					uni.removeTabBarBadge({
						index: 3
					})
				}
				if (!this.TOKEN || !goodsList.length) return
				let mixMapList = goodsList.map(item => {
					return  {platformGoodsSpecMixId:item.platformGoodsSpecMixId.toString(),busType:item.busType||''}
				}
				)
				updatePrice({mixMapList:mixMapList}).then(res => {
					if (res.code == 200) {
						goodsList.forEach((item, index) => {
							item.platformPrice = res.data[index].platformPrice,
							item.supplierId = res.data[index].supplierId,
							item.supplierName = res.data[index].supplierName,
							item.isSelfSend = res.data[index].isSelfSend
							item.supplierPrice = res.data[index].supplierPrice
							
						})
						uni.setStorageSync('CARGOODLIST', goodsList)
						let num = this.$common.clacCount(goodsList)
						if (num == 0) {
							uni.removeTabBarBadge({
								index: 3
							})
						} else {
							uni.setTabBarBadge({
								index: 3,
								text: num
							})
						}
						this.goodsList = this.filterArrayBysupplierId(goodsList)
						
					} else {
						uni.showToast({
							title: res.msg||'系统错误',
							icon: 'none',
							mask: true
						})
					}
				})
			},
			getDoc() {
				this.$common.toAgreement({
					docCode: 'b_order_info'
				})
			},
			handleOneDelect(index,delectShopIndex) {
				this.delectIndex = index
				this.delectShopIndex = delectShopIndex
				this.showDeleteOne = true
			},

			// 去结算 需要判断 是否满足金额  其次是否是送货地址
			handlesubmit() {
				
				if(!this.arrFalg.length){
					this.$u.toast('请最少选择一个商品下单')
					return
				}
			
			let info =	this.infoByAreaIdFee.childList.find(item =>item.diff)
			if(info){
				this.NoFeeInfo =info
				this.showPay = true
				return
			}
				// this.NoFeeInfo = 
				
				if(!this.LOCATION.areaId){
					this.showLocaltion = true
					return
				}
				this.showFeePrice = false
				this.showPrice = false
				if (!this.LOCATION.addressId) {
					this.showAddress = true
				} else {
					uni.navigateTo({
						url: '/pages/confirm/index?addressId=' + this.LOCATION.addressId
					})
				}

			},
			chooseAddress() {
				uni.navigateTo({
					url: '/pages/my/address/address?isShopCart=true'
				})
			},
			handleDele() {
				this.showDelete = true
			},
			// 更新购物车
			valChange(e,shopIndex,index) {
				let goodsCarList = this.goodsList|| []
				if (e.purNum == 0) { //删除操作
					goodsCarList[shopIndex].list.splice(index, 1)
				} else {
					//只有購物車的時候 才手動更新列表
					goodsCarList[shopIndex].list[index].purNum = e.purNum
					goodsCarList[shopIndex].list[index].platformPrice = e.platformPrice
				}
				this.goodsList = goodsCarList
				this.revertGoods()
			},
			showLogin() {
				this.$refs.LoginPopup.checkLogin()
			},
			handleLocation() {
				uni.navigateTo({
					url: '/pages/addressLocation'
				})
			},
			bindClick() {

			},
			// 打开编辑
			changeEdit() {
				this.isEdit = true
			},
			selectAll(e) {
				this.$nextTick(() => {
					this.goodsList.map(v => {
						v.checkFlag = e
						v.list.forEach(l =>{
							l.checkFlag = e
						})
					})
				})
			},
			echoAllSelect() {
				this.$nextTick(() => {
					let indexCheck = this.goodsList.every(val => {
						return val.checkFlag
					});
					if (indexCheck) {
						this.$refs.SubmitBtn.checked = true
					} else {
						this.$refs.SubmitBtn.checked = false
					}
				})
			},
			checkboxChange(item,shop) {
				item.checkFlag = !item.checkFlag
				shop.checkFlag = !shop.list.some(item => !item.checkFlag)
				// if(item.checkFlag){
				// 	// shop.supplierId
				// 	this.goodsList.forEach(_shop =>{
				// 		if(_shop.supplierId!=shop.supplierId){
				// 			// _shop.checkFlag = false
				// 			_shop.list.forEach(_item =>{
				// 				_item.checkFlag = false
				// 			})
				// 		}
						
				// 	})
				// }
				// uni.setStorageSync('CARGOODLIST', this.goodsList)
				// this.echoAllSelect()
				// this.revertGoods()

			},
			checkboxChangeShop(item) {
				item.checkFlag = !item.checkFlag
				item.list.forEach(i =>{
					i.checkFlag = item.checkFlag
				})
				// if(item.checkFlag){
				// 	// shop.supplierId
				// 	this.goodsList.forEach(_shop =>{
				// 		if(_shop.supplierId!=item.supplierId){
				// 			// _shop.checkFlag = false
				// 			// _shop.list.forEach(_item =>{
				// 			// 	_item.checkFlag = false
				// 			// })
				// 		}
						
				// 	})
				// }
				// this.revertGoods()
				// uni.setStorageSync('CARGOODLIST', this.goodsList)
			},
			
			confirmCheckOneDelect() {
				this.goodsList[this.delectShopIndex].list.splice(this.delectIndex, 1)
				// this.revertGoods()
			},
			// 删除所选
			confirmCheckDelect() {
				let newList =  []
				this.goodsList.forEach(item =>{
					let list = []
					item.list.forEach(goods =>{
						if(!goods.checkFlag){
							list.push(goods)
						}
					})
					item.list = list
					newList.push(item)
				})
				this.goodsList = newList
				this.revertGoods()
			},
			confirmClear() {
				this.goodsList = []
				uni.setStorageSync('CARGOODLIST', this.goodsList)
				uni.removeTabBarBadge({
					index: 3
				})
				// this.$u.vuex('CARGOODLIST', [])
			},
			goHome() {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			handleSearch(e){
				if(!e.supplierId){
					
					uni.navigateTo({
						url:'/pages/search/result?supplierModel=2'
					})
				}else{
					uni.navigateTo({
						url:'/pages/search/result?source='+e.supplierId
					})
				}
				
			},
			checkFeeInfo(e){
				let info = {
							sendLimit:0,
							diff:0
						}
				if(this.infoByAreaIdFee.childList.length&&this.infoByAreaIdFee.childList.find(_e =>_e.sign==e)){
					let res = this.infoByAreaIdFee.childList.find(_e =>_e.sign==e)
					return {
						sendLimit:res.sendLimit||0,
						diff:res.diff||0
					}
				}else{
					return info
				}
				
			},
			infoByAreaId() {
				
				if (this.LOCATION.areaId&&this.arrFalg.length) {
					uni.showLoading({
						title:'加载中...',
						mask:true
					})
					let orderChildList = []
					const groupedData = {};
					for (const item of this.goodsList) {
						if(!item.checkFlag)continue
						const supplierId = item.list[0].isSelfSend==0?'':item.list[0].supplierId;
						if (!groupedData[supplierId]) {
							groupedData[supplierId] = {
								goodsList:[],
								isSelfSend: item.list[0].isSelfSend,
								platformMoney:0,
								sign: item.list[0].isSelfSend==0?'':item.supplierId
							};
						}
						let list = item.list.map(e =>{
							let price = new Decimal(e.purNum).mul(new Decimal(e.platformPrice||0))
							groupedData[supplierId].platformMoney = new Decimal(groupedData[supplierId].platformMoney).add(price)
							return  {saleNum:e.purNum,platformGoodsSpecMixId:e.platformGoodsSpecMixId,image:e.image}
						})
						groupedData[supplierId].goodsList.push(...list);
					}
					for (const key in groupedData) {
						orderChildList.push(groupedData[key]);
					}
					this.orderChildList = orderChildList||[]
					let params = {
						areaId: this.LOCATION.areaId,
						orderChildList:orderChildList
					}
					return getSendMoney(params).then(res => {
						uni.hideLoading()
						if (res.code == 200) {
							if(res.data){
								this.infoByAreaIdFee = res.data
								this.warpperHeight = this.initWarpperHeight - (this.checkFeeInfo('').sendLimit?uni.upx2px(70):0)
							}else{
								this.infoByAreaIdFee={
									sendMoney: 0,
									childList:[]
								}
							}
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none',
								mask: true
							})
						}
					})
				}else{
					uni.hideLoading()
					this.infoByAreaIdFee={
						sendMoney: 0,
						childList:[]
					}
				}

			},
	
		}
	}
</script>

<style lang="scss" scoped>
	/deep/ .uni-swipe {
		border-radius: 20rpx !important;
		background-color: white !important;
		// margin : 10rpx 0;

	}
	.borderBottomNone{
		border-width: 0 !important;
	}

	.handle_sc {
		width: 134rpx;
		height: 190rpx;
		background: #48A147;
		color: white;
		flex-direction: column;
	}

	.handle_delect {
		background-color: #FF4500;
		width: 110rpx;
		height: 220rpx;
		color: white;
		flex-direction: column;
	}

	.address-desc {}

	.content {

		margin: 30rpx;
		margin-top: 0;

		.shop-container {
			padding: 20rpx 0;
			background: #FFFFFF;
			background-color: white;
			border-radius: 20rpx;
			padding-bottom: 0;
		}

		.item {
			padding: 10rpx 20rpx;
			border-bottom: 2rpx dashed #FFE5E5E5;
		}
	}

	.empty {
		margin-top: 250rpx;

		.go-home {
			width: 160rpx;
			height: 58rpx;
			background: linear-gradient(90deg, #48A147 0%, #8AE38A 100%);
			border-radius: 34rpx 34rpx 34rpx 34rpx;
			font-size: 26rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			margin: 0 auto;
			margin-top: 30rpx;
		}
	}

	.handle-top {
		margin: 20rpx 30rpx;

		.edit-text {
			font-size: 26rpx;
			color: $app-theme;
		}

		.clear-text {
			font-size: 26rpx;
			color: #FF4500;
		}
	}

	.top-box-search {
		background: linear-gradient(90deg, #ECFFEB 0%, #FFF4F0 100%);
		// background-image:url('../../static/kind-bg.png');
		background-size: 100%;
	}
	.sendClass{
		margin-left: auto;
		margin-right: 30rpx;
	}
	.cdxx{
		text-align: center;
		font-size: 24rpx;
		padding: 3rpx 10rpx;
		color:white;
		background: #EF2929;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
	}
	.cdxx-box{
		padding:0 20rpx;
		border-bottom: 2rpx solid #E5E5E5;
		padding-bottom: 15rpx;
		margin-bottom: 20rpx;
		.cdxx-right{
			margin-left: auto;
		}
	}
</style>